import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

/*
 * @author[hansen]
 * @date[创建日期: 2022/7/18 14:15]
 * @version[版本: v1.0]
 * @function[功能简介: ]
 */
class ClearTextFieldWidget extends StatefulWidget {
  final String? text;
  final String? labelText;
  final String? hintText;
  final String? counterText;
  final TextStyle? textStyle;
  final TextStyle? hintStyle;
  final TextStyle? counterStyle;
  final TextAlign textAlign;
  final int? maxLines;
  final int? maxLength;
  final Color? cursorColor;
  final Color clearIconColor;
  final double clearIconSize;

  ///隐藏文本
  final bool obscureText;
  final InputBorder? inputBorder;
  final TextEditingController? controller;
  final List<TextInputFormatter>? inputFormatters;
  final TextInputType? keyboardType;
  final Widget? prefixIcon;
  final Widget? clearIcon;

  const ClearTextFieldWidget({
    Key? key,
    this.text,
    this.labelText,
    this.hintText,
    this.counterText,
    this.textStyle,
    this.hintStyle,
    this.counterStyle,
    this.textAlign = TextAlign.start,
    this.maxLines,
    this.maxLength,
    this.cursorColor = const Color(0xffC20014),
    this.clearIconColor = const Color(0xffd8d8d8),
    this.clearIconSize = 20,
    this.obscureText = false,
    this.inputBorder,
    this.controller,
    this.inputFormatters,
    this.keyboardType,
    this.prefixIcon,
    this.clearIcon,
  }) : super(key: key);

  @override
  State<ClearTextFieldWidget> createState() => _ClearTextFieldWidgetState();
}

class _ClearTextFieldWidgetState extends State<ClearTextFieldWidget> {
  late TextEditingController textEditingController;

  ///输入框焦点控制
  final FocusNode _focusNode = FocusNode();

  bool _hasFocus = false;
  bool _showClearIcon = false;

  @override
  void initState() {
    super.initState();

    textEditingController = widget.controller ?? TextEditingController();

    // textEditingController.selection = TextSelection.fromPosition(
    //   TextPosition(offset: textEditingController.text.length),
    // );

    _focusNode.addListener(() {
      _showClearIcon  = textEditingController.text.isNotEmpty;
      if (_focusNode.hasFocus) {
        setState(() {
          _hasFocus = true;
        });
      } else {
        setState(() {

          _hasFocus = false;
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Expanded(
          child: TextField(
            focusNode: _focusNode,
            controller: widget.controller,
            cursorColor: widget.cursorColor,
            textAlign: widget.textAlign,
            maxLines: widget.maxLines ?? 1,
            maxLength: widget.maxLength,
            inputFormatters: widget.inputFormatters,
            keyboardType: widget.keyboardType,
            style: widget.textStyle,
            obscureText: widget.obscureText,
            decoration: InputDecoration(
              hintStyle: widget.hintStyle,
              counterStyle: widget.counterStyle,
              labelText: widget.labelText,
              hintText: widget.hintText,
              border: widget.inputBorder,
              counterText: widget.counterText,
              prefixIcon: widget.prefixIcon,
            ),
            onChanged: (str) {
              setState(() {
                _showClearIcon = textEditingController.text.isNotEmpty;
              });
            },
            onSubmitted: (str) {
              setState(() {
                _hasFocus = false;
              });
            },
          ),
        ),
        _showClearIcon && _hasFocus
            ? GestureDetector(
                behavior: HitTestBehavior.translucent,
                onTap: () {
                  textEditingController.text = "";

                  setState(() {
                    _showClearIcon = textEditingController.text.isNotEmpty;
                  });
                },
                child: widget.clearIcon ??
                    Icon(
                      Icons.cancel,
                      size: widget.clearIconSize,
                      color: widget.clearIconColor,
                    ),
              )
            : const SizedBox(
                width: 20,
                height: 20,
              )
      ],
    );
  }
}
